<template>
  <div class="send">
    <div></div>
    <div v-html="text"></div>
  </div>
</template>
<script>
export default {
  props: {
    text: {
      type: String,
      default: ""
    }
  },
  created() {
    //console.log("text", this.text);
  },
  methods: {}
};
</script>
<style type="text/css">
body {
  background: #4d4948;
}
.send {
  font-size: 14px;
  position: relative;
  width: 100%;
  line-height: 35px;
  background: #f5f7fa;
  border-radius: 5px; /* 圆角 */
  min-height: 35px;
  padding: 0 10px;
  margin: 0px 5px 0px 0px;
  color: #9d9fa1;
}

.send .arrow {
  position: absolute;
  top: 5px;
  left: -16px; /* 圆角的位置需要细心调试哦 */
  width: 0;
  height: 0;
  font-size: 0;
  border: solid 8px;
  border-color: #ffffff #f5f7fe #ffffff #ffffff;
}
.right {
  right: -16px; /* 圆角的位置需要细心调试哦 */
}
.left {
  left: -16px; /* 圆角的位置需要细心调试哦 */
}
.down {
  down: -16px; /* 圆角的位置需要细心调试哦 */
}
</style>
